Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(annotations): provide fallback for line annotation markers #1091

Merged
merged 12 commits into from
Apr 2, 2021

Conversation

rshen91
Copy link
Contributor

@rshen91 rshen91 commented Mar 26, 2021

Summary

Fixes #1036
In the playground, if there is no SpecMarkerPosition this doesn't seem to lead to the same sort of bug where the marker is off the chart.

Added a story under test cases and test stories with rotations.

@rshen91 rshen91 added :annotation Annotation (line, rect, text) related issue wip work in progress labels Mar 26, 2021
@codecov-io
Copy link

codecov-io commented Mar 26, 2021

Codecov Report

Merging #1091 (c475411) into master (396b3d1) will increase coverage by 0.32%.
The diff coverage is 72.72%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #1091      +/-   ##
==========================================
+ Coverage   71.82%   72.14%   +0.32%     
==========================================
  Files         381      397      +16     
  Lines       11917    12232     +315     
  Branches     2600     2628      +28     
==========================================
+ Hits         8559     8825     +266     
- Misses       3327     3368      +41     
- Partials       31       39       +8     
Flag Coverage Δ
unittests 71.72% <72.72%> (-0.11%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
...hart_types/xy_chart/annotations/line/dimensions.ts 86.53% <72.72%> (ø)
src/utils/d3-delaunay/index.ts 50.30% <0.00%> (-1.49%) ⬇️
src/mocks/theme.ts 86.66% <0.00%> (ø)
src/mocks/store/index.ts 100.00% <0.00%> (ø)
src/mocks/store/store.ts 92.59% <0.00%> (ø)
src/mocks/geometries.ts 92.85% <0.00%> (ø)
src/mocks/series/data.ts 100.00% <0.00%> (ø)
src/mocks/series/series.ts 91.22% <0.00%> (ø)
src/mocks/specs/specs.ts 83.33% <0.00%> (ø)
src/mocks/index.ts 100.00% <0.00%> (ø)
... and 8 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 396b3d1...c475411. Read the comment docs.

@rshen91 rshen91 marked this pull request as ready for review March 29, 2021 15:09
Comment on lines 288 to 291
// catch the case of a chart with no axes nor specMarkerPosition for a vertical line annotation
if (!axisPosition && !specMarkerPosition && isXDomain) {
return Position.Bottom;
}
Copy link
Member

@markov00 markov00 Mar 29, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you please check the getDefaultMarkerPositionFromAxis function? I see that this also covers the case where the axisPosition is undefined but I don't know if we are considering all the cases.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you! 2b4f5de

Copy link
Member

@markov00 markov00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Left few comments: in particular, it needs to account for rotations.
Can you also please add a specific VRT that changes the rotation and checks the 4 rotations values screenshots?

@@ -310,7 +309,7 @@ function getDefaultMarkerPositionFromAxis(
if (axisPosition) {
return axisPosition;
}
if ((isXDomain && isHorizontal) || (!isXDomain && !isHorizontal)) {
if (!isXDomain && isHorizontal) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This doesn't covers all the cases. Please check and fix this to cover the case where the chart is rotated 90,-90 degrees.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you! Please see changes in e58089a 🙇‍♀️

@@ -283,10 +283,9 @@ function getAnchorPosition(
isXDomain: boolean,
isChartHorizontal: boolean,
specMarkerPosition?: Position,
axisPosition?: Position,
axisPosition?: Position | undefined,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this argument is already optional when using the ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

changed in e58089a thank you!

@@ -297,7 +296,7 @@ function getAnchorPosition(

function validateMarkerPosition(isXDomain: boolean, isHorizontal: boolean, position: Position): Position | undefined {
if ((isXDomain && isHorizontal) || (!isXDomain && !isHorizontal)) {
return position === Position.Top || position === Position.Bottom ? position : undefined;
return position === Position.Top || position === Position.Bottom ? position : Position.Bottom;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this defaults to the dflPositionFromAxis if the configured specMarkerPosition doesn't pass this validation.
It's better to keep the defaults in a single place

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yep! Fixed in e58089a thank you

@rshen91 rshen91 removed the wip work in progress label Mar 31, 2021
@github-actions
Copy link

The Workflow run is cancelling this PR. It is an earlier duplicate of 1821200 run.

@rshen91
Copy link
Contributor Author

rshen91 commented Mar 31, 2021

jenkins test this - accessibility test is flakey but has passed in 8c5e803

@rshen91 rshen91 requested a review from markov00 April 1, 2021 15:30
Copy link
Member

@markov00 markov00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I haven't understood why we need to use that and what changed on master.
I've checked the currently deployed storybook and seems to work pretty well the text here.
Can you please run a rm -rf node_modules && yarn install to clean up the dependencies and checks if the problem persist without the marked dependency?

integration/tests/test_cases_stories.test.ts Outdated Show resolved Hide resolved
src/chart_types/xy_chart/annotations/line/dimensions.ts Outdated Show resolved Hide resolved
src/chart_types/xy_chart/annotations/line/dimensions.ts Outdated Show resolved Hide resolved
src/chart_types/xy_chart/annotations/line/dimensions.ts Outdated Show resolved Hide resolved
src/chart_types/xy_chart/annotations/line/dimensions.ts Outdated Show resolved Hide resolved
@rshen91
Copy link
Contributor Author

rshen91 commented Apr 2, 2021

I haven't understood why we need to use that and what changed on master.
I've checked the currently deployed storybook and seems to work pretty well the text here.
Can you please run a rm -rf node_modules && yarn install to clean up the dependencies and checks if the problem persist without the marked dependency?

You were right! Thanks! 0ba5d9b

@rshen91 rshen91 requested a review from markov00 April 2, 2021 16:36
Copy link
Member

@markov00 markov00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All good for me! thanks for the changes

@rshen91 rshen91 merged commit 0bd61f1 into elastic:master Apr 2, 2021
nickofthyme pushed a commit that referenced this pull request Apr 2, 2021
# [28.0.0](v27.0.0...v28.0.0) (2021-04-02)

### Bug Fixes

* **annotations:** provide fallback for line annotation markers ([#1091](#1091)) ([0bd61f1](0bd61f1))
* **legend:** action sizing ui and focus states ([#1102](#1102)) ([3a76a2c](3a76a2c))
* **legend:** stop legend color picker dot twitching ([#1101](#1101)) ([c89b767](c89b767))

### Code Refactoring

* rename enum types to singular ([#1064](#1064)) ([396b3d1](396b3d1)), closes [#767](#767)

### BREAKING CHANGES

* `AnnotationDomainTypes`, `AnnotationTypes`, `SeriesTypes`, `ChartTypes`, and `SpecTypes` are renamed to `AnnotationDomainType`, `AnnotationType`, `SeriesType`, `ChartType`, and `SpecType`
@nickofthyme
Copy link
Collaborator

🎉 This PR is included in version 28.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

@nickofthyme nickofthyme added the released Issue released publicly label Apr 2, 2021
AMoo-Miki pushed a commit to AMoo-Miki/OpenSearch-Dashboards that referenced this pull request Feb 10, 2022
# [28.0.0](elastic/elastic-charts@v27.0.0...v28.0.0) (2021-04-02)

### Bug Fixes

* **annotations:** provide fallback for line annotation markers ([opensearch-project#1091](elastic/elastic-charts#1091)) ([d907c81](elastic/elastic-charts@d907c81))
* **legend:** action sizing ui and focus states ([opensearch-project#1102](elastic/elastic-charts#1102)) ([a58cc0a](elastic/elastic-charts@a58cc0a))
* **legend:** stop legend color picker dot twitching ([opensearch-project#1101](elastic/elastic-charts#1101)) ([f63bb3b](elastic/elastic-charts@f63bb3b))

### Code Refactoring

* rename enum types to singular ([opensearch-project#1064](elastic/elastic-charts#1064)) ([6e900e2](elastic/elastic-charts@6e900e2)), closes [opensearch-project#767](elastic/elastic-charts#767)

### BREAKING CHANGES

* `AnnotationDomainTypes`, `AnnotationTypes`, `SeriesTypes`, `ChartTypes`, and `SpecTypes` are renamed to `AnnotationDomainType`, `AnnotationType`, `SeriesType`, `ChartType`, and `SpecType`
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
:annotation Annotation (line, rect, text) related issue released Issue released publicly
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Wrong annotation marker position without axis
4 participants